
<template>
    <a-row>
        <a-col :span="7">
            <a-input-search v-model:value="searchKey" placeholder="请输入数据信息" style="width: 200px; margin-bottom: 10px;"
                @search="onSearch()" />
        </a-col>
        <a-col :span="7">
            <a-select v-model:value="form.instrumentType" placeholder="选择仪器系列" style="width: 200px">
                <a-select-option v-for="item of instrumentData" :key="item">{{ item }}</a-select-option>
            </a-select>
        </a-col>
    </a-row>

    <a-table :rowKey="(record) => record.instrumentId" :row-selection="rowSelection" :dataSource="dataSource" size="small"
        :columns="columns" bordered :scroll="{ x: 1000 }" :pagination="false">
        <template #bodyCell="{ column, text, record }">
            {{ text }}
        </template>
    </a-table>

    <AntdZh>
        <a-pagination v-model:current="query.pageNum" v-model:pageSize="query.pageSize" :total="total" @change="getList" />
    </AntdZh>
</template>
<script setup>
import { ref } from 'vue';
import { craftList, instrumentList } from '../../tool/craft'
import { queryList } from "@/api/tool/instrument.js";
import useApp from "@/hooks";
const { $, proxy } = useApp();
const emit = defineEmits(["instrumentSelection",]);
const instrumentDatas = ref(instrumentList)
const instrumentData = Object.values(instrumentDatas.value).map(item => item.name)
const instrumentType = ref('')
const data = reactive({
    form: {}
});
const { form } = toRefs(data);
const dataSource = ref([]);
const total = ref(1)
// 定义表格列配置
const columns = [
    {
        title: '规格型号',
        dataIndex: 'instrumentId',
        key: 'instrumentId',
        fixed: 'left',
        width: 150
    },
    {
        title: '仪器名称',
        dataIndex: 'instrumentName',
        key: 'instrumentName',
        width: 300
    },
    {
        title: '外径（mm）',
        dataIndex: 'outerDiameter',
        key: 'outerDiameter',
        width: 130
    },
    {
        title: '重量（kg）',
        dataIndex: 'weight',
        key: 'weight',
        width: 130
    },
    {
        title: '有效长度(m)',
        dataIndex: 'length',
        key: 'length',
        width: 100
    },
    {
        title: '纵向抗压力(kN)',
        dataIndex: 'longitudinalPressure',
        key: 'longitudinalPressure',
        width: 100
    },
    {
        title: '纵向抗张力(kN)',
        dataIndex: 'longitudinalTension',
        key: 'longitudinalTension',
        width: 100
    },
    {
        title: '纵向抗扭力(N·M)',
        dataIndex: 'torsionResistance',
        key: 'torsionResistance',
        width: 100
    },
    {
        title: '适合最大井眼(mm)',
        dataIndex: 'maxWell',
        key: 'maxWell',
        width: 100
    },
    {
        title: '适合最小井眼(mm)',
        dataIndex: 'minWell',
        key: 'minWell',
        width: 100
    },
    {
        title: '记录点(m)',
        dataIndex: 'record',
        key: 'record',
        width: 100
    },
    {
        title: '耐温度(℃)',
        dataIndex: 'temperatureResistance',
        key: 'temperatureResistance',
        width: 100
    },
    {
        title: '运输长度(m)',
        dataIndex: 'transportationLength',
        key: 'transportationLength',
        width: 100
    },
    {
        title: '耐电压(MPa)',
        dataIndex: 'voltageResistance',
        key: 'voltageResistance',
        width: 100
    },
    // {
    //     title: '测井内容',
    //     dataIndex: 'loggingContent',
    //     key: 'loggingContent',
    //     width: 200
    // }
];
const searchKey = ref();
const query = ref({ pageNum: 1, pageSize: 10, sortBy: 'id', searchKey: '' });

const rowSelection = {
    onChange: (selectedRowKeys, selectedRows) => {
        emit("instrumentSelection", selectedRows)
    },
    getCheckboxProps: record => ({
        disabled: record.instrumentId === 'Disabled Instrument',
        // Column configuration not to be checked
        instrumentId: record.instrumentId,
    }),
};


/** 查询井列表 */
function getList() {
    queryList(query.value).then((response) => {
        dataSource.value = response.content;
        total.value = response.totalElements;
    });
}
getList();

/** 搜索按钮操作 */
function onSearch() {
    query.value.searchKey = searchKey;
    getList();
}

/** 表单重置 */
function reset() {
    searchKey.value = '';
    query.value = {
        pageNum: 1, pageSize: 10, sortBy: 'id',
        searchKey: '',
    }
    getList();
}

/** 提交按钮 */
function submitItem() {

}
</script>
  